<template>
	<view>
	<view class="end-title">
	　　<view @tap="change(0)" :class="{btna:btnnum == 0}">未盘</view>
	  　<view @tap="change(1)" :class="{btna:btnnum == 1}">已盘</view>
	</view>
	<view class="end-cont" :class="{dis:btnnum == 0}"><view>123</view>
	</view>
	<view class="end-cont" :class="{dis:btnnum == 1}"><view>345</view>
	</view>
</view>
</view>
</template>

<script>
	export default {
		data() {
		   return {
		      btnnum: 0,
		   };
		},
		methods:{
		   change(e) {
		      this.btnnum = e
		      console.log(this.btnnum)
		  }
		}
	}
</script>

<style>
   /* 将三个内容view的display设置为none(隐藏) */
       .end-title{
           display: flex;
       }
       .end-title view{
           flex-grow: 1;
           text-align: center;
       }
       .end-cont{
           display: none;
           background: #C8C7CC;
       }
       .btna{
           color: #FFFFFF;
           background: #00A0FF;
       }
       .dis{
           display: block;
       } 
</style>
